<%@page import="java.text.SimpleDateFormat"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!doctype html>
<html>
	<head>
		<base href="<%=basePath%>" />
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<meta name="renderer" content="webkit">
		<meta http-equiv="Cache-Control" content="no-siteapp" />
		<meta name="apple-mobile-web-app-title" content="Amaze UI" />
		<link rel="stylesheet" href="layui/css/layui.css" media="all"> <!-- 适应所有设备 -->
		<style type="text/css">
		</style>
	</head>
	<% String nowDay = new SimpleDateFormat("yyyy-MM-dd").format(new Date()); %>
	<body>
	    <br/>
	    <form class="layui-form">
	      <div class="layui-form-item">
	        <label class="layui-form-label">输入密码</label>
	        <div class="layui-input-block">
	          <input type="text" name="password" id="password" required="" lay-verify="required" placeholder="输入密码" autocomplete="off" class="layui-input" maxlength="20" style="width:10%">
	        </div>
	      </div>
	      <div class="layui-form-item">
	        <label class="layui-form-label">账号前缀</label>
	        <div class="layui-input-block">
	          <input type="number" name="prefixNumber" id="prefixNumber" required="" lay-verify="required" placeholder="输入账号前缀" autocomplete="off" class="layui-input" max="9" style="width:10%">
	        </div>
	      </div>
	      <div class="layui-form-item">
	        <label class="layui-form-label">设置数量</label>
	        <div class="layui-input-block">
	          <input type="number" style="width:10%" lay-verify="required" id="Count" name="Count"  autocomplete="off" class="layui-input" min="1" max="100">
	        </div>
	      </div>
	      <div class="layui-form-item">
            <div class="layui-input-block">
              <button class="layui-btn" lay-submit lay-filter="changePhone">立即提交</button>
              <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
	  </form>
	    
	    <table class="layui-table" id="BatchAccount" lay-filter="BatchAccount">
        <caption style="color:#d71345">批量生成账号</caption>
        </table>
        <br>
	
	    <script src="js/jquery.min.js"></script>
		<script src="layui/layui.js"></script>
		<script>
		    layui.use(['layer','form','table'],function(){
		    	var layer = layui.layer,
		    	    form  = layui.form,
		    	    table = layui.table;
		    	
		    	
		    	//定义全局变量
		    	var datasource;
		    	
		    	form.on('submit(changePhone)',function(data){
	    			$.ajax({
	    				type:'POST',
	    				url:'player/AccountPhoneBatchGenerate',
	    				async:true,
	    				data:{prefixNumber:data.field.prefixNumber,password:data.field.password,Count:data.field.Count},
	    				success:function(resp){
	    					window.datasource = JSON.parse(resp);
    						layer.msg("操作成功",{icon:1});
    						setTimeout(function(){
    							$("#prefixNumber").val("");
    							$("#password").val("");
    							$("#Count").val("");
    							table.reload('AllTable', {data:window.datasource.data});
    						},2000);
	    				}
	    			})
		    		return false;
		    	});
		    	
		    	table.render({
	        		  elem:'#BatchAccount',
	        		  method : 'post',
	        		  totalRow:true,
	        		  toolbar: '#toolbar', //开启头部工具栏，并为其绑定左侧模板
			    	  defaultToolbar: ['exports'],  //隐藏右边工具栏
	        		  cellMinWidth : 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
	        		  id:'AllTable',
	        		  cols:[[
	        			  {field : 'Phone',title : '号码'},
	        			  {field : 'password',title : '密码'}
	        			  ]],
	        			  /* done:function(res, curr, count){
	           				for(var i = 0;i < res.data.length;i++){
	           					if(res.data[i].Name != '防水木料' && res.data[i].Name != '精炼矿石' && res.data[i].Name != '海妖外壳' && res.data[i].Name != '潮汐精粹' && res.data[i].Name != '深海魔晶' && res.data[i].Name != '倍击道具'){
	           						$("[lay-id='AllTable8'] tbody tr[data-index=" + i + "]").hide();
	           					}
	           				}
	            		  }, */
	        			  data:[{"Phone":"无","password":"无"}]
	        	  });
		    });
		</script>
    </body>
</html>